<template>
	<view class="mobile-item-container">
    <Navbar title="工作台" bgColor="#fff" :h5Show="true"></Navbar>
		<view v-if="list && list.length > 0">
		  <view class="mobile-item-container" v-for="(items, key) in list" :key="key">
		    <view style="font-size: 40rpx; font-weight: bold; padding: 0 0 40rpx 0;">{{items.label}}</view>
		    <u-grid col="3">
		      <u-grid-item v-for="(item, index) in items.children" :key="index" @click="searchDetail(item.id, item.label, item.isPic)">
		        <u-icon :name="item.icon" color="#2979ff" size="60rpx"></u-icon>
		        <text class="btn-text">{{item.label}}</text>
		      </u-grid-item>
		    </u-grid>
		  </view>
		  <view class="mobile-item-container">
		    <view style="font-size: 40rpx; font-weight: bold; padding: 0 0 40rpx 0;">旅行社区</view>
		    <u-grid col="3">
		      <u-grid-item @click="toPage('/pages/business/infoCommunity/list')">
		        <u-icon name="chat" color="#2979ff" size="60rpx"></u-icon>
		        <text class="btn-text">旅行社区</text>
		      </u-grid-item>
		    </u-grid>
		  </view>
		</view>
		<u-empty v-else></u-empty>
	</view>
</template>

<script>
	import Navbar from '@/components/navbar/Navbar'

	import * as columnApi from '@/api/business/column'
	export default {
		components: {
		  Navbar
		},
		data() {
			return {
				title: null,
				list: []
			}
		},
		mounted() {
		    const app = this;
		    uni.$on('update', function(data) {
		        app.loadData()
		    })
		},    
		//为了优化代码，可以加上移除事件，避免重复监听事件
		onUnload() {
		    // 移除监听事件  
		    uni.$off('update');
		},
		onLoad () {
		  this.loadData()
		},  
		methods: {
			scrolltolower () {
			  this.loadData();
			},
			loadData(){
				columnApi.columnList().then(res => {
					this.list = res.data;
				})
			},
			searchDetail(columnId,title,isPic){
				uni.navigateTo({ url: '/pages/business/columnDetail/list?columnId=' + columnId + '&title=' + title + '&isPic=' + isPic})
			},
			toPage(path){
				uni.navigateTo({ url: path})
			}
		}
	}
</script>

<style>

</style>
